<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <meta name="format-detection" content="telphone=no, email=no"/>
    <meta name="HandheldFriendly" content="true">
    <meta name="MobileOptimized" content="320">
    <!--强制竖屏、全屏-->
    <meta name="screen-orientation" content="portrait">
    <meta name="x5-orientation" content="portrait">
    <meta name="full-screen" content="yes">
    <meta name="x5-fullscreen" content="true">
    <meta name="browsermode" content="application">
    <meta name="x5-page-mode" content="app">
    <meta name="msapplication-tap-highlight" content="no">

    <meta name="description" content="">
    <meta name="keywords" content="">
    <title>EMPTY DEMO</title>
    <script>!function(a,b){function c(){var b=f.getBoundingClientRect().width;b/i>540&&(b=540*i);var c=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}var d,e=a.document,f=e.documentElement,g=e.querySelector('meta[name="viewport"]'),h=e.querySelector('meta[name="flexible"]'),i=0,j=0,k=b.flexible||(b.flexible={});if(g){console.warn("将根据已有的meta标签来设置缩放比例");var l=g.getAttribute("content").match(/initial\-scale=([\d\.]+)/);l&&(j=parseFloat(l[1]),i=parseInt(1/j))}else if(h){var m=h.getAttribute("content");if(m){var n=m.match(/initial\-dpr=([\d\.]+)/),o=m.match(/maximum\-dpr=([\d\.]+)/);n&&(i=parseFloat(n[1]),j=parseFloat((1/i).toFixed(2))),o&&(i=parseFloat(o[1]),j=parseFloat((1/i).toFixed(2)))}}if(!i&&!j){var p=a.navigator.userAgent,q=(!!p.match(/android/gi),!!p.match(/iphone/gi)),r=q&&!!p.match(/OS 9_3/),s=a.devicePixelRatio;i=q&&!r?s>=3&&(!i||i>=3)?3:s>=2&&(!i||i>=2)?2:1:1,j=1/i}if(f.setAttribute("data-dpr",i),!g)if(g=e.createElement("meta"),g.setAttribute("name","viewport"),g.setAttribute("content","initial-scale="+j+", maximum-scale="+j+", minimum-scale="+j+", user-scalable=no"),f.firstElementChild)f.firstElementChild.appendChild(g);else{var t=e.createElement("div");t.appendChild(g),e.write(t.innerHTML)}a.addEventListener("resize",function(){clearTimeout(d),d=setTimeout(c,300)},!1),a.addEventListener("pageshow",function(a){a.persisted&&(clearTimeout(d),d=setTimeout(c,300))},!1),"complete"===e.readyState?e.body.style.fontSize=12*i+"px":e.addEventListener("DOMContentLoaded",function(){e.body.style.fontSize=12*i+"px"},!1),c(),k.dpr=a.dpr=i,k.refreshRem=c,k.rem2px=function(a){var b=parseFloat(a)*this.rem;return"string"==typeof a&&a.match(/rem$/)&&(b+="px"),b},k.px2rem=function(a){var b=parseFloat(a)/this.rem;return"string"==typeof a&&a.match(/px$/)&&(b+="rem"),b}}(window,window.lib||(window.lib={}));</script>

    <!-- build:css styles/style.min.css -->
    <link rel="stylesheet" href="styles/style.css">
    <!-- endbuild -->
</head>
<body>

    <section class="am-container">
        <div class="am-g">
            <div class="am-u-sm-6 am-u-md-4 am-u-lg-3 am-text-primary" style="background-color: #0a628f">sm-6 md-4 lg-3</div>
            <div class="am-u-sm-6 am-u-md-8 am-u-lg-9 am-text-danger">sm-6 md-8 lg-9</div>
        </div>

        <div class="am-btn am-btn-primary am-btn-xs">xs</div>
        <div class="am-btn am-btn-primary am-btn-sm">sm</div>
        <div class="am-btn am-btn-primary">no</div>
        <div class="am-btn am-btn-primary am-btn-lg">lg</div>
        <div class="am-btn am-btn-primary am-btn-xl">xl</div>


        <code>code here</code>


        <form class="am-form">
            <fieldset>
                <legend>表单标题</legend>

                <div class="am-form-group">
                    <label for="doc-ipt-email-1">邮件</label>
                    <input type="email" class="" id="doc-ipt-email-1" placeholder="输入电子邮件">
                </div>

                <div class="am-form-group">
                    <label for="doc-ipt-pwd-1">密码</label>
                    <input type="password" class="" id="doc-ipt-pwd-1" placeholder="设置个密码吧">
                </div>

                <div class="am-form-group">
                    <label for="doc-ipt-file-1">原生文件上传域</label>
                    <input type="file" id="doc-ipt-file-1">
                    <p class="am-form-help">请选择要上传的文件...</p>
                </div>

                <div class="am-form-group am-form-file">
                    <label for="doc-ipt-file-2">Amaze UI 文件上传域</label>
                    <div>
                        <button type="button" class="am-btn am-btn-default am-btn-sm">
                            <i class="am-icon-cloud-upload"></i> 选择要上传的文件</button>
                    </div>
                    <input type="file" id="doc-ipt-file-2">
                </div>

                <div class="am-checkbox">
                    <label>
                        <input type="checkbox"> 复选框，选我选我选我
                    </label>
                </div>

                <div class="am-radio">
                    <label>
                        <input type="radio" name="doc-radio-1" value="option1" checked>
                        单选框 - 选项1
                    </label>
                </div>

                <div class="am-radio">
                    <label>
                        <input type="radio" name="doc-radio-1" value="option2">
                        单选框 - 选项2
                    </label>
                </div>

                <div class="am-form-group">
                    <label class="am-checkbox-inline">
                        <input type="checkbox" value="option1"> 选我
                    </label>
                    <label class="am-checkbox-inline">
                        <input type="checkbox" value="option2"> 同时可以选我
                    </label>
                    <label class="am-checkbox-inline">
                        <input type="checkbox" value="option3"> 还可以选我
                    </label>
                </div>

                <div class="am-form-group">
                    <label class="am-radio-inline">
                        <input type="radio"  value="" name="docInlineRadio"> 每一分
                    </label>
                    <label class="am-radio-inline">
                        <input type="radio" name="docInlineRadio"> 每一秒
                    </label>
                    <label class="am-radio-inline">
                        <input type="radio" name="docInlineRadio"> 多好
                    </label>
                </div>

                <div class="am-form-group">
                    <label for="doc-select-1">下拉多选框</label>
                    <select id="doc-select-1">
                        <option value="option1">选项一...</option>
                        <option value="option2">选项二.....</option>
                        <option value="option3">选项三........</option>
                    </select>
                    <span class="am-form-caret"></span>
                </div>

                <div class="am-form-group">
                    <label for="doc-select-2">多选框</label>
                    <select multiple class="" id="doc-select-2">
                        <option>1</option>
                        <option>2</option>
                        <option>3</option>
                        <option>4</option>
                        <option>5</option>
                    </select>
                </div>

                <div class="am-form-group">
                    <label for="doc-ta-1">文本域</label>
                    <textarea class="" rows="5" id="doc-ta-1"></textarea>
                </div>

                <p><button type="submit" class="am-btn am-btn-default">提交</button></p>
            </fieldset>
        </form>

        <table class="am-table">
            <thead>
            <tr>
                <th>网站名称</th>
                <th>网址</th>
                <th>创建时间</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>Amaze UI</td>
                <td>http://amazeui.org</td>
                <td>2012-10-01</td>
            </tr>
            <tr>
                <td>Amaze UI</td>
                <td>http://amazeui.org</td>
                <td>2012-10-01</td>
            </tr>
            <tr class="am-active">
                <td>Amaze UI(Active)</td>
                <td>http://amazeui.org</td>
                <td>2012-10-01</td>
            </tr>
            <tr>
                <td>Amaze UI</td>
                <td>http://amazeui.org</td>
                <td>2012-10-01</td>
            </tr>
            <tr>
                <td>Amaze UI</td>
                <td>http://amazeui.org</td>
                <td>2012-10-01</td>
            </tr>
            </tbody>
        </table>

        <table class="am-table am-table-bordered am-table-striped am-table-compact">
            <thead>
            <tr>
                <th>网站名称</th>
                <th>网址</th>
                <th>创建时间</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>Amaze UI</td>
                <td>http://amazeui.org</td>
                <td>2012-10-01</td>
            </tr>
            <tr>
                <td>Amaze UI</td>
                <td>http://amazeui.org</td>
                <td>2012-10-01</td>
            </tr>
            <tr class="am-active">
                <td>Amaze UI(Active)</td>
                <td>http://amazeui.org</td>
                <td>2012-10-01</td>
            </tr>
            <tr>
                <td>Amaze UI</td>
                <td>http://amazeui.org</td>
                <td>2012-10-01</td>
            </tr>
            <tr>
                <td>Amaze UI</td>
                <td>http://amazeui.org</td>
                <td>2012-10-01</td>
            </tr>
            </tbody>
        </table>

    </section>


    <!-- build:js scripts/app.min.js -->
    <script src="../node_modules/jquery/dist/jquery.min.js"></script>
    <script src="vendors/pxloader/pxloader-images.min.js"></script>
    <script src="vendors/gsap/TweenMax.min.js"></script>

    <script src="scripts/utils.js"></script>
    <script src="scripts/app.js"></script>
    <!-- endbuild -->
</body>
</html>